<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>myhome</title>
<link href="css/bootstrap-fileinput.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" media="screen" href="css/information/test.css" />
<link rel="stylesheet" href="css/information/amazeui.min.css">
<link rel="stylesheet" href="css/information/amazeui.cropper.css">
<link rel="stylesheet" href="css/information/custom_up_img.css">
	<script type="text/javascript">
        var userId = ${userinfo.getUserId()};
	</script>
</head>

<body id="top" >
	<!--header -->
	<div id="header-wrap">
		<header>
			<hgroup>
				<h2>
					<a href="#">&nbsp&nbsp&nbsp&nbsp&nbsp${userinfo.getNickName()}</a>
				</h2>
			</hgroup>
			<!-- 顶部导航 -->
			<%@ include file="header.jsp"%>
			<!-- 顶部导航结束 -->
			<%--<div id="quick-search">
				<div class="search">
					<label>Search:</label>
					<input class="tbox" id="qsearch1" type="text" placeholder="Search..." />
					<button class="btn" onclick="search()">Search</button>
				</div>
			</div>--%>
		</header>
	</div>

	<!-- content-wrap -->
	<div id="content-wrap">

		<!-- content -->
		<div id="content" class="clearfix">

			<!-- main -->
			<div class="content">
				<!-- 文章简介列表 -->
				<c:forEach items="${articleList}" var="articleList">
					<article class="excerpt">
						<div class="header ">
							<img class="user-img" src="${articleList.userInfo.picture}">
							<div class="name-time-wrapper"><span class="time">${articleList.userInfo.nickName}</span><span class="time">
                        <i class="glyphicon glyphicon-time"></i>${articleList.articleDate}</span>
							</div>
							<div class="author_r">
								<div class="digg" id = "heart">
									<i class="glyphicon glyphicon-heart"></i><span>${articleList.collectedNum}</span>
								</div>
							</div>
						</div>
						<div style="clear: both;"></div>
						<div class="mycontext">
							<c:if test='${articleList.articlePicture!= ""}'>
								<a class="focus" href="#" target="_blank">
									<img class="thumb" src="${articleList.articlePicture}" style="display: inline;">
								</a>
							</c:if>
							<c:forEach items="${articleList.tags}" var="tag">
								<a class="cat" href="articleList/${tags.tagId}">${tag.tagName}<i></i>
								</a>
							</c:forEach>
							<h2><a href="article/${articleList.articleId}" target="_blank">${articleList.title}</a></h2>
							<input type="hidden"  id="hAId" value="${articleList.articleId}">
							<p class="meta"></p><p class="note">${articleList.simContent}</p>
						</div>
						<div class="ff">
							<div class="iiicon pull-left">
								<div class="digg" id="zan">
									<i class="glyphicon glyphicon-thumbs-up"></i>
									<span>${articleList.zanNum}</span>
								</div>
								<div class="digg" id="cai">
									<i class="glyphicon glyphicon-thumbs-down"></i>
									<span>${articleList.caiNum}</span>
								</div>
							</div>
							<div class="digg">
								<i class="glyphicon glyphicon-comment"></i>
								<span> 查看神评</span>
							</div>
						</div>
					</article>
				</c:forEach>

				<!-- /main -->
			</div>




			<!-- sidebar -->
			<div id="sidebar">

				<div class="about-me">

					<div class="User-info">
						<div>
								<div class="up-img-cover"  id="up-img-touch" >
									<a title=${userinfo.getNickName() } href="#" class="ImgLink img">
										<img class="am-circle" alt="点击图片上传" src="${userinfo.getPicture()}"  >
									</a>
								</div>
								<div>
									<a style="text-align: center; display: block;"  id="pic"></a>
								</div>
						</div>
						<div>
							<a class="userlink" href="javascript:">${userinfo.getNickName()}</a><br>
							<span><a class="userlink" href="#">关注:${userinfo.getFocusNum() }</a> </span><br>
							<span><a class="userlink" href="#">粉丝:${userinfo.getFansNum() }</a> </span>
						</div>
					</div>
				</div>
				<div class="sidemenu">
					<h3>近期关注他的段友</h3>
					<ul>
						<c:forEach items="${focus.myUserList}" var="focus">
							<li>${focus.nickName}</li>
						</c:forEach>
					</ul>
				</div>
				<div class="sidemenu">
					<h3>他的收藏</h3>
					<ul>
						<c:forEach items="${collected }" var="collected">
							<li><a href="article/${collected.article.articleId}">${collected.article.title } <span>${collected.article.articleDate}</span>
							</a>
							</li>
						</c:forEach>
					</ul>
				</div>
				<div class="sidemenu popular">
					<h3>段友喜爱他的段子</h3>
					<ul>
						<c:forEach items="${article}" var="article">
							<li><a href="article/${article.articleId}">${article.title } <span>${article.articleDate}</span>
							</a>
							</li>
						</c:forEach>
					</ul>
				</div>
				<!-- /sidebar -->
			</div>
			<!-- content -->
		</div>
		<!-- /content-out -->
	</div>
	</div>
	</div>
</body>
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/information/amazeui.min.js" charset="utf-8"></script>
<script src="js/information/cropper.min.js" charset="utf-8"></script>
<script src="js/information/custom_up_img.js" charset="utf-8"></script>
<script src="js/home/home.js" charset="utf-8"></script>
<script src="js/dianZan/dianZan.js" charset="utf-8"></script>
</html>
